<template>
  <div>

    <h2>
      {{ stu }}
    </h2>

    <el-button type="success" @click="addProperty">动态添加响应式属性</el-button>
  </div>
</template>

<script>
export default {
  name: "test",
  data() {
    return {
      stu: {},
      msg:{}
    }
  },
  created() {
    setTimeout(() => {
      this.stu = {
        name: 'jack'
      }
    }, 1500)
  },
  methods: {
    addProperty() {
      /**
       *  不能这样设置
       this.stu = {
         age: 23
       }*/
      // 不能这样设置  this.stu.age = 23

      // vue添加动态的响应式属性，用Object.assign  或 this.$set

      this.stu = Object.assign({}, this.stu, {
        age: 24,
        emailL: '123@qq.com'
      })

      // this.$set(this.stu, 'age', 25)
    }
  }
}
</script>

<style scoped>

</style>
